package com.example.zxw.ui.items

import androidx.compose.foundation.layout.*
import androidx.compose.material3.Divider
import androidx.compose.ui.layout.Layout
import androidx.compose.ui.layout.Placeable
import androidx.compose.ui.layout.layoutId
import androidx.compose.ui.unit.Constraints

import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import coil.compose.AsyncImage
import com.example.zxw.entity.NewsListEntity

@Composable
fun NewsItemRightImg(entity: NewsListEntity) {
    Column {
        CustomRightImgText(
            modifier = Modifier
                .padding(horizontal = 20.dp, vertical = 10.dp),
            content = {
                Text(
                    text = entity.title,
                    style = TextStyle(fontSize = 18.sp),
                    modifier = Modifier.layoutId("title")
                )
                Row(modifier = Modifier
                    .padding(top = 8.dp)
                    .layoutId("date")) {
                    Text(text = entity.source, style = TextStyle(fontSize = 11.sp, color = Color.Gray))
                    Text(
                        text = entity.pubtime,
                        style = TextStyle(fontSize = 11.sp, color = Color.Gray),
                        modifier = Modifier.padding(start = 8.dp)
                    )
                }
                AsyncImage(
                    model = entity.picture,
                    contentDescription = "",
                    modifier = Modifier
                        .padding(start = 8.dp)
                        .width(120.dp)
                        .height(80.dp)
                        .layoutId("img"),
                    contentScale = ContentScale.Crop
                )
            })
        Divider(color = Color.Gray, thickness = 0.5.dp)
    }

}

@Composable
fun CustomRightImgText(modifier: Modifier, content: @Composable () -> Unit) {
    Layout(
        content = content,
        modifier = modifier
    ) { measurables, constraints ->
        var totalHeight = 0;
        var totalWidth = constraints.maxWidth;

        lateinit var imgPlaceable: Placeable
        lateinit var titlePlaceable: Placeable
        lateinit var datePlaceable: Placeable
        //先测量图片的宽高
        measurables.map {
            when (it.layoutId) {
                "img" -> {
                    imgPlaceable = it.measure(constraints)
                }
            }
        }

        //根据图片的宽度来计算 文字区域的最大宽度
        val leftConstraints =
            Constraints(0, constraints.maxWidth - imgPlaceable.width, 0, constraints.maxHeight)
        measurables.map {
            when (it.layoutId) {
                "title" -> {
                    titlePlaceable = it.measure(leftConstraints)
                }

                "date" -> {
                    datePlaceable = it.measure(leftConstraints)
                }
            }
        }

        totalHeight = if (titlePlaceable.height + datePlaceable.height > imgPlaceable.height) {
            titlePlaceable.height + datePlaceable.height
        } else {
            imgPlaceable.height
        }

        layout(totalWidth, totalHeight, placementBlock = {
            //排放右侧图片
            imgPlaceable.placeRelative(totalWidth - imgPlaceable.width, 0)
            //摆放标题
            titlePlaceable.placeRelative(0, 0)
            //根据图片高度和内容高度，确定日期位置
            if (titlePlaceable.height + datePlaceable.height > imgPlaceable.height) {
                datePlaceable.placeRelative(0, titlePlaceable.height)
            } else {
                datePlaceable.placeRelative(0, imgPlaceable.height - datePlaceable.height)
            }
        });
    }
}

@Preview
@Composable
fun previewNewsItemRightImg(){
    NewsItemRightImg(entity = NewsListEntity().apply {
        source = "source"
        pubtime = "2022"
        title = "我是一个标题"
        picture = "https://ts3.cn.mm.bing.net/th?id=OIP-C.Md86Wi2EYiKHNPldRZiD4gHaEo&w=316&h=197&c=8&rs=1&qlt=90&o=6&pid=3.1&rm=2"
    })
}